import { createApp, toRaw } from 'vue'
import './style.css'
import App from './App.vue'
import router from './router'
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
/* 引入createPinia，用于创建pinia */
import { createPinia } from 'pinia'
// 引入pinia-plugin-persistedstate持久化插件
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'
/* 引入全局组件 */
import panelHead from './components/panelHead.vue'
/* 引入全局前置路由守卫 */
import './router/permission'
// 引入menuStore
import { useMenuStore } from './stores/menu'

/* 创建pinia */
const pinia = createPinia()
// 注册pinia-plugin-persistedstate持久化插件
pinia.use(piniaPluginPersistedstate)

const app = createApp(App)
// 注册pinia
app.use(pinia)
// 注册全局组件
app.component('panelHead', panelHead)


// 恢复动态路由 要放在注册路由之前
// 动态路由必须在 Vue Router 初始化之前添加完成，才能确保页面首次加载或刷新时能正确显示内容
const menuStore = useMenuStore()
if (menuStore.routerList && menuStore.routerList.length > 0) {
    menuStore.dynamicMenu(menuStore.routerList)
    menuStore.routerList.forEach(route => {
        router.addRoute('main', route)
    })
}

for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
    app.component(key, component)
}

// 注册路由
app.use(router)
app.mount('#app')
